/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 *
 * @format
 * @flow
 */

import React, {Component} from 'react';
import {Platform, StyleSheet, Image, Text, TouchableOpacity, View} from 'react-native';
import {SwitchNavigator} from 'react-navigation';
import {Router, Modal, Stack, Scene, Drawer, Lightbox, Overlay} from 'react-native-router-flux';
import CardStackStyleInterpolator from 'react-navigation/src/views/StackView/StackViewStyleInterpolator';

import {MapView} from './lib/js/index'

import Login from "./pages/Login";
import Home from "./pages/Home";
import Splash from './pages/Splash';
import MenuImage from './assets/images/nav_menu.png';
import JPushModule from 'jpush-react-native';
import Menu from "./pages/components/Menu";


export default class App extends Component {


    componentDidMount() {
        JPushModule.initPush();
    }

    openDrawer() {

    }

    render() {
        const onBackPress = () => {
            if (Actions.state.key == "login") {
                return false
            } else {
                if (Actions.state.index !== 0) {
                    return false
                }
                Actions.pop()
                return true
            }
        }

        return (
            <Router backAndroidHandler={onBackPress}>
                <Overlay hideNavBar>
                    <Modal key="modal" hideNavBar
                           transitionConfig={() => ({screenInterpolator: CardStackStyleInterpolator.forFadeFromBottomAndroid})}>
                        <Lightbox key="lightbox">
                            <Stack>
                                <Scene key="splash" hideNavBar component={Splash}/>
                                <Scene key="login" hideNavBar component={Login}/>

                                <Drawer hideNavBar key="home" initial={true} contentComponent={Menu} drawerIcon={() => {
                                    return (
                                        <View style={styles.menuButton}>
                                            <Image style={styles.menuIcon} source={MenuImage}/>
                                        </View>
                                    )
                                }} drawerWidth={240}>
                                    <Scene key="home" title="出行一网通" navigationBarStyle={styles.barStyle}
                                           component={Home}/>
                                </Drawer>
                            </Stack>
                        </Lightbox>
                    </Modal>
                </Overlay>
            </Router>
        );
    }
}
const styles = StyleSheet.create({
    barStyle: {
        borderBottomWidth: 0,
        backgroundColor:"#fff"
    },
    menuButton: {
        width: 44,
        height: 44,
        alignItems: "center",
        justifyContent: "center"
    },
    menuIcon: {
        width: 24,
        height: 24,
    }
});

